npm - payload-richtext-tiptap - Versions diffs - 0.0.47 → 0.0.48 - Mend

payload-richtext-tiptap 0.0.47 → 0.0.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (44) hide show

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AAExD,OAAO,~~EAAE~~,eAAe,~~EAAE~~,MAAM,kCAAkC,CAAC;~~AACnE~~,eAAO,MAAM,kBAAkB,uBAAwB,eAAe,2BAIjE;IACD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,~~gCAiEF~~,CAAC"}
1	+ {"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AAExD,OAAO,EAEL,eAAe,EAChB,MAAM,kCAAkC,CAAC;AAC1C,eAAO,MAAM,kBAAkB,uBAAwB,eAAe,2BAIjE;IACD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,gCA4EF,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.js CHANGED Viewed

@@ -3,14 +3,26 @@ import { NodeViewWrapper } from "@tiptap/react";
 import { useCallback } from "react";
 export const ImageUploadBuilder = (openAssetHQHandler)=>{
     const ImageUpload = ({ getPos, editor })=>{
-        const onUpload = useCallback((url)=>{
-            if (url) {
-                editor.chain().focus().setImageBlock({
-                    src: url
-                }).deleteRange({
-                    from: getPos(),
-                    to: getPos()
-                }).focus().run();
+        const onUpload = useCallback((asset)=>{
+            if (asset) {
+                console.log("asset in ImageUpload itself:", asset);
+                if (asset.type === "IMAGE") {
+                    editor.chain().focus().setImageBlock({
+                        src: asset.fullUrl
+                    }) //TODO: should also set other fields to data-media-id ... it'd be easier to later find which media id is this.
+                    .deleteRange({
+                        from: getPos(),
+                        to: getPos()
+                    }).focus().run();
+                } else {
+                    editor.chain().focus().setVideoBlock({
+                        src: asset.videoUrl,
+                        poster: asset.fullUrl
+                    }).deleteRange({
+                        from: getPos(),
+                        to: getPos()
+                    }).focus().run();
+                }
             }
         }, [
             getPos,
@@ -33,7 +45,7 @@ export const ImageUploadBuilder = (openAssetHQHandler)=>{
                         e.preventDefault();
                         openAssetHQHandler(onUpload);
                     },
-                    children: "Upload Image"
+                    children: "Select an asset"
                 })
             })
         });

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"sourcesContent":["import { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport { useCallback } from \"react\";\nimport { openAssetHQType } from \"src/fields/TiptapEditor/types.js\";\nexport const ImageUploadBuilder = (openAssetHQHandler: openAssetHQType) => {\n const ImageUpload = ({\n getPos,\n editor,\n }: {\n getPos: () => number;\n editor: Editor;\n }) => {\n const onUpload = useCallback(\n (~~url~~: ~~string~~) => {\n if (~~url~~) {\n editor\n .chain()\n .focus()\n .setImageBlock({ src: ~~url~~ })\n .deleteRange({ from: getPos(), to: getPos() })\n .focus()\n .run();\n }\n },\n [getPos, editor]\n );\n\n return (\n <NodeViewWrapper>\n <div className=\"p-0 m-0\" data-drag-handle>\n {/* <RenderFields\n fieldMap={[\n {\n name: \"media\",\n type: \"upload\",\n cellComponentProps: {\n name: \"media\",\n schemaPath: \"media\",\n },\n fieldComponentProps: {},\n fieldIsPresentational: true,\n isFieldAffectingData: false,\n localized: false,\n },\n ]}\n path=\"media\"\n readOnly={false}\n schemaPath=\"\"\n // fieldTypes={fieldTypes}\n // fields={sidebarFields}\n // permissions={permissions.fields}\n // readOnly={!hasSavePermission}\n /> /}\n <a\n href=\"#\"\n style={{\n padding: 5,\n borderRadius: 5,\n backgroundColor: \"blue\",\n color: \"white\",\n cursor: \"pointer\",\n }}\n onClick={(e) => {\n e.preventDefault();\n openAssetHQHandler(onUpload);\n }}\n >\n ~~Upload~~ ~~Image~~\n </a>\n {/ <ImageUploader onUpload={onUpload} /> */}\n </div>\n </NodeViewWrapper>\n );\n };\n\n return ImageUpload;\n};\n"],"names":["NodeViewWrapper","useCallback","ImageUploadBuilder","openAssetHQHandler","ImageUpload","getPos","editor","onUpload","~~url~~","chain","focus","setImageBlock","src","deleteRange","from","to","run","div","className","data-drag-handle","a","href","style","padding","borderRadius","backgroundColor","color","cursor","onClick","e","preventDefault"],"mappings":";AAAA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,SAASC,WAAW,QAAQ,QAAQ;~~AAEpC~~,OAAO,MAAMC,qBAAqB,CAACC;IACjC,MAAMC,cAAc,CAAC,EACnBC,MAAM,EACNC,MAAM,EAIP;QACC,MAAMC,WAAWN,YACf,CAACO;YACC,IAAIA,KAAK;~~gBACPF~~,~~OACGG~~,KAAK,GACLC,KAAK,GACLC,aAAa,CAAC;~~oBAAEC~~,~~KAAKJ~~;~~gBAAI~~,~~GACzBK~~,WAAW,CAAC;~~oBAAEC~~,~~MAAMT~~;~~oBAAUU~~,~~IAAIV~~;~~gBAAS~~,~~GAC3CK~~,KAAK,~~GACLM~~,GAAG;~~YACR~~;QACF,GACA;~~YAACX~~;YAAQC;SAAO;QAGlB,qBACE,KAACN;sBACC,cAAA,~~KAACiB~~;gBAAIC,WAAU;gBAAUC,kBAAgB;0BAwBvC,cAAA,KAACC;oBACCC,MAAK;oBACLC,OAAO;wBACLC,SAAS;wBACTC,cAAc;wBACdC,iBAAiB;wBACjBC,OAAO;wBACPC,QAAQ;oBACV;oBACAC,SAAS,CAACC;wBACRA,EAAEC,cAAc;~~wBAChB3B~~,mBAAmBI;oBACrB;8BACD;;;;IAOT;IAEA,OAAOH;AACT,EAAE"}
1	+ {"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"sourcesContent":["import { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport { useCallback } from \"react\";\nimport {\n AssetReturnType,\n openAssetHQType,\n} from \"src/fields/TiptapEditor/types.js\";\nexport const ImageUploadBuilder = (openAssetHQHandler: openAssetHQType) => {\n const ImageUpload = ({\n getPos,\n editor,\n }: {\n getPos: () => number;\n editor: Editor;\n }) => {\n const onUpload = useCallback(\n (asset: AssetReturnType) => {\n if (asset) {\n console.log(\"asset in ImageUpload itself:\", asset);\n if (asset.type === \"IMAGE\") {\n editor\n .chain()\n .focus()\n .setImageBlock({ src: asset.fullUrl }) //TODO: should also set other fields to data-media-id ... it'd be easier to later find which media id is this.\n .deleteRange({ from: getPos(), to: getPos() })\n .focus()\n .run();\n } else {\n editor\n .chain()\n .focus()\n .setVideoBlock({ src: asset.videoUrl, poster: asset.fullUrl })\n .deleteRange({ from: getPos(), to: getPos() })\n .focus()\n .run();\n }\n }\n },\n [getPos, editor]\n );\n\n return (\n <NodeViewWrapper>\n <div className=\"p-0 m-0\" data-drag-handle>\n {/* <RenderFields\n fieldMap={[\n {\n name: \"media\",\n type: \"upload\",\n cellComponentProps: {\n name: \"media\",\n schemaPath: \"media\",\n },\n fieldComponentProps: {},\n fieldIsPresentational: true,\n isFieldAffectingData: false,\n localized: false,\n },\n ]}\n path=\"media\"\n readOnly={false}\n schemaPath=\"\"\n // fieldTypes={fieldTypes}\n // fields={sidebarFields}\n // permissions={permissions.fields}\n // readOnly={!hasSavePermission}\n /> /}\n <a\n href=\"#\"\n style={{\n padding: 5,\n borderRadius: 5,\n backgroundColor: \"blue\",\n color: \"white\",\n cursor: \"pointer\",\n }}\n onClick={(e) => {\n e.preventDefault();\n openAssetHQHandler(onUpload);\n }}\n >\n Select an asset\n </a>\n {/ <ImageUploader onUpload={onUpload} /> */}\n </div>\n </NodeViewWrapper>\n );\n };\n\n return ImageUpload;\n};\n"],"names":["NodeViewWrapper","useCallback","ImageUploadBuilder","openAssetHQHandler","ImageUpload","getPos","editor","onUpload","asset","console","log","type","chain","focus","setImageBlock","src","fullUrl","deleteRange","from","to","run","setVideoBlock","videoUrl","poster","div","className","data-drag-handle","a","href","style","padding","borderRadius","backgroundColor","color","cursor","onClick","e","preventDefault"],"mappings":";AAAA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,SAASC,WAAW,QAAQ,QAAQ;AAKpC,OAAO,MAAMC,qBAAqB,CAACC;IACjC,MAAMC,cAAc,CAAC,EACnBC,MAAM,EACNC,MAAM,EAIP;QACC,MAAMC,WAAWN,YACf,CAACO;YACC,IAAIA,OAAO;gBACTC,QAAQC,GAAG,CAAC,gCAAgCF;gBAC5C,IAAIA,MAAMG,IAAI,KAAK,SAAS;oBAC1BL,OACGM,KAAK,GACLC,KAAK,GACLC,aAAa,CAAC;wBAAEC,KAAKP,MAAMQ,OAAO;oBAAC,GAAG,8GAA8G;qBACpJC,WAAW,CAAC;wBAAEC,MAAMb;wBAAUc,IAAId;oBAAS,GAC3CQ,KAAK,GACLO,GAAG;gBACR,OAAO;oBACLd,OACGM,KAAK,GACLC,KAAK,GACLQ,aAAa,CAAC;wBAAEN,KAAKP,MAAMc,QAAQ;wBAAEC,QAAQf,MAAMQ,OAAO;oBAAC,GAC3DC,WAAW,CAAC;wBAAEC,MAAMb;wBAAUc,IAAId;oBAAS,GAC3CQ,KAAK,GACLO,GAAG;gBACR;YACF;QACF,GACA;YAACf;YAAQC;SAAO;QAGlB,qBACE,KAACN;sBACC,cAAA,KAACwB;gBAAIC,WAAU;gBAAUC,kBAAgB;0BAwBvC,cAAA,KAACC;oBACCC,MAAK;oBACLC,OAAO;wBACLC,SAAS;wBACTC,cAAc;wBACdC,iBAAiB;wBACjBC,OAAO;wBACPC,QAAQ;oBACV;oBACAC,SAAS,CAACC;wBACRA,EAAEC,cAAc;wBAChBlC,mBAAmBI;oBACrB;8BACD;;;;IAOT;IAEA,OAAOH;AACT,EAAE"}

package/dist/src/fields/TiptapEditor/extensions/Video/Video.d.ts ADDED Viewed

@@ -0,0 +1,52 @@
+import { Node } from "@tiptap/core";
+export interface VideoOptions {
+    /**
+     * Controls if the image node should be inline or not.
+     * @default false
+     * @example true
+     */
+    inline: boolean;
+    /**
+     * Controls if base64 images are allowed. Enable this if you want to allow
+     * base64 image urls in the `src` attribute.
+     * @default false
+     * @example true
+     */
+    allowBase64: boolean;
+    /**
+     * HTML attributes to add to the image element.
+     * @default {}
+     * @example { class: 'foo' }
+     */
+    HTMLAttributes: Record<string, any>;
+}
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        video: {
+            /**
+             * Add an image
+             * @param options The image attributes
+             * @example
+             * editor
+             *   .commands
+             *   .setVideo({ src: 'https://tiptap.dev/logo.png', alt: 'tiptap', title: 'tiptap logo' })
+             */
+            setVideo: (options: {
+                src: string;
+                alt?: string;
+                title?: string;
+                poster?: string;
+            }) => ReturnType;
+        };
+    }
+}
+/**
+ * Matches an image to a ![image](src "title") on input.
+ */
+export declare const inputRegex: RegExp;
+/**
+ * This extension allows you to insert images.
+ * @see https://www.tiptap.dev/api/nodes/image
+ */
+export declare const Video: Node<VideoOptions, any>;
+//# sourceMappingURL=Video.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/Video/Video.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Video.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/Video/Video.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,IAAI,EAAiB,MAAM,cAAc,CAAC;AAEpE,MAAM,WAAW,YAAY;IAC3B;;;;OAIG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;OAKG;IACH,WAAW,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACrC;AAED,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,KAAK,EAAE;YACL;;;;;;;eAOG;YACH,QAAQ,EAAE,CAAC,OAAO,EAAE;gBAClB,GAAG,EAAE,MAAM,CAAC;gBACZ,GAAG,CAAC,EAAE,MAAM,CAAC;gBACb,KAAK,CAAC,EAAE,MAAM,CAAC;gBACf,MAAM,CAAC,EAAE,MAAM,CAAC;aACjB,KAAK,UAAU,CAAC;SAClB,CAAC;KACH;CACF;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,QACqC,CAAC;AAE7D;;;GAGG;AACH,eAAO,MAAM,KAAK,yBAiFhB,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/Video/Video.js ADDED Viewed

@@ -0,0 +1,81 @@
+import { mergeAttributes, Node, nodeInputRule } from "@tiptap/core";
+/**
+ * Matches an image to a ![image](src "title") on input.
+ */ export const inputRegex = /(?:^|\s)(!\[(.+|:?)]\((\S+)(?:(?:\s+)["'](\S+)["'])?\))$/;
+/**
+ * This extension allows you to insert images.
+ * @see https://www.tiptap.dev/api/nodes/image
+ */ export const Video = Node.create({
+    name: "video",
+    addOptions () {
+        return {
+            inline: false,
+            allowBase64: false,
+            HTMLAttributes: {}
+        };
+    },
+    inline () {
+        return this.options.inline;
+    },
+    group () {
+        return this.options.inline ? "inline" : "block";
+    },
+    draggable: true,
+    addAttributes () {
+        return {
+            src: {
+                default: null
+            },
+            alt: {
+                default: null
+            },
+            title: {
+                default: null
+            },
+            poster: {
+                default: null
+            }
+        };
+    },
+    parseHTML () {
+        return [
+            {
+                tag: this.options.allowBase64 ? "video[src]" : 'video[src]:not([src^="data:"])'
+            }
+        ];
+    },
+    renderHTML ({ HTMLAttributes }) {
+        return [
+            "video",
+            mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)
+        ];
+    },
+    addCommands () {
+        return {
+            setVideo: (options)=>({ commands })=>{
+                    return commands.insertContent({
+                        type: this.name,
+                        attrs: options
+                    });
+                }
+        };
+    },
+    addInputRules () {
+        return [
+            nodeInputRule({
+                find: inputRegex,
+                type: this.type,
+                getAttributes: (match)=>{
+                    const [, , alt, src, title] = match;
+                    return {
+                        src,
+                        alt,
+                        title
+                    };
+                }
+            })
+        ];
+    }
+});
+//# sourceMappingURL=Video.js.map

package/dist/src/fields/TiptapEditor/extensions/Video/Video.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/Video/Video.ts"],"sourcesContent":["import { mergeAttributes, Node, nodeInputRule } from \"@tiptap/core\";\n\nexport interface VideoOptions {\n /**\n * Controls if the image node should be inline or not.\n * @default false\n * @example true\n */\n inline: boolean;\n\n /**\n * Controls if base64 images are allowed. Enable this if you want to allow\n * base64 image urls in the `src` attribute.\n * @default false\n * @example true\n */\n allowBase64: boolean;\n\n /**\n * HTML attributes to add to the image element.\n * @default {}\n * @example { class: 'foo' }\n */\n HTMLAttributes: Record<string, any>;\n}\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n video: {\n /**\n * Add an image\n * @param options The image attributes\n * @example\n * editor\n * .commands\n * .setVideo({ src: 'https://tiptap.dev/logo.png', alt: 'tiptap', title: 'tiptap logo' })\n */\n setVideo: (options: {\n src: string;\n alt?: string;\n title?: string;\n poster?: string;\n }) => ReturnType;\n };\n }\n}\n\n/**\n * Matches an image to a ![image](src \"title\") on input.\n */\nexport const inputRegex =\n /(?:^|\\s)(!\\[(.+|:?)]\$(\\S+)(?:(?:\\s+)[\"'](\\S+)[\"'])?\$)$/;\n\n/**\n * This extension allows you to insert images.\n * @see https://www.tiptap.dev/api/nodes/image\n */\nexport const Video = Node.create<VideoOptions>({\n name: \"video\",\n\n addOptions() {\n return {\n inline: false,\n allowBase64: false,\n HTMLAttributes: {},\n };\n },\n\n inline() {\n return this.options.inline;\n },\n\n group() {\n return this.options.inline ? \"inline\" : \"block\";\n },\n\n draggable: true,\n\n addAttributes() {\n return {\n src: {\n default: null,\n },\n alt: {\n default: null,\n },\n title: {\n default: null,\n },\n poster: {\n default: null,\n },\n };\n },\n\n parseHTML() {\n return [\n {\n tag: this.options.allowBase64\n ? \"video[src]\"\n : 'video[src]:not([src^=\"data:\"])',\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\n \"video\",\n mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),\n ];\n },\n\n addCommands() {\n return {\n setVideo:\n (options) =>\n ({ commands }) => {\n return commands.insertContent({\n type: this.name,\n attrs: options,\n });\n },\n };\n },\n\n addInputRules() {\n return [\n nodeInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: (match) => {\n const [, , alt, src, title] = match;\n\n return { src, alt, title };\n },\n }),\n ];\n },\n});\n"],"names":["mergeAttributes","Node","nodeInputRule","inputRegex","Video","create","name","addOptions","inline","allowBase64","HTMLAttributes","options","group","draggable","addAttributes","src","default","alt","title","poster","parseHTML","tag","renderHTML","addCommands","setVideo","commands","insertContent","type","attrs","addInputRules","find","getAttributes","match"],"mappings":"AAAA,SAASA,eAAe,EAAEC,IAAI,EAAEC,aAAa,QAAQ,eAAe;AA+CpE;;CAEC,GACD,OAAO,MAAMC,aACX,2DAA2D;AAE7D;;;CAGC,GACD,OAAO,MAAMC,QAAQH,KAAKI,MAAM,CAAe;IAC7CC,MAAM;IAENC;QACE,OAAO;YACLC,QAAQ;YACRC,aAAa;YACbC,gBAAgB,CAAC;QACnB;IACF;IAEAF;QACE,OAAO,IAAI,CAACG,OAAO,CAACH,MAAM;IAC5B;IAEAI;QACE,OAAO,IAAI,CAACD,OAAO,CAACH,MAAM,GAAG,WAAW;IAC1C;IAEAK,WAAW;IAEXC;QACE,OAAO;YACLC,KAAK;gBACHC,SAAS;YACX;YACAC,KAAK;gBACHD,SAAS;YACX;YACAE,OAAO;gBACLF,SAAS;YACX;YACAG,QAAQ;gBACNH,SAAS;YACX;QACF;IACF;IAEAI;QACE,OAAO;YACL;gBACEC,KAAK,IAAI,CAACV,OAAO,CAACF,WAAW,GACzB,eACA;YACN;SACD;IACH;IAEAa,YAAW,EAAEZ,cAAc,EAAE;QAC3B,OAAO;YACL;YACAV,gBAAgB,IAAI,CAACW,OAAO,CAACD,cAAc,EAAEA;SAC9C;IACH;IAEAa;QACE,OAAO;YACLC,UACE,CAACb,UACD,CAAC,EAAEc,QAAQ,EAAE;oBACX,OAAOA,SAASC,aAAa,CAAC;wBAC5BC,MAAM,IAAI,CAACrB,IAAI;wBACfsB,OAAOjB;oBACT;gBACF;QACJ;IACF;IAEAkB;QACE,OAAO;YACL3B,cAAc;gBACZ4B,MAAM3B;gBACNwB,MAAM,IAAI,CAACA,IAAI;gBACfI,eAAe,CAACC;oBACd,MAAM,KAAKf,KAAKF,KAAKG,MAAM,GAAGc;oBAE9B,OAAO;wBAAEjB;wBAAKE;wBAAKC;oBAAM;gBAC3B;YACF;SACD;IACH;AACF,GAAG"}

package/dist/src/fields/TiptapEditor/extensions/Video/index.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from "./Video.js";
2	+ //# sourceMappingURL=index.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/Video/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/Video/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/Video/index.js ADDED Viewed

@@ -0,0 +1,3 @@
+export * from "./Video.js";
+//# sourceMappingURL=index.js.map

package/dist/src/fields/TiptapEditor/extensions/Video/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/Video/index.ts"],"sourcesContent":["export * from \"./Video.js\";\n"],"names":[],"mappings":"AAAA,cAAc,aAAa"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.d.ts ADDED Viewed

@@ -0,0 +1,21 @@
+import { Range } from "@tiptap/core";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        videoBlock: {
+            setVideoBlock: (attributes: {
+                src: string;
+                poster: string;
+            }) => ReturnType;
+            setVideoBlockAt: (attributes: {
+                src: string;
+                poster: string;
+                pos: number | Range;
+            }) => ReturnType;
+            setVideoBlockAlign: (align: "left" | "center" | "right") => ReturnType;
+            setVideoBlockWidth: (width: number) => ReturnType;
+        };
+    }
+}
+export declare const VideoBlock: import("@tiptap/react").Node<import("../Video/Video.js").VideoOptions, any>;
+export default VideoBlock;
+//# sourceMappingURL=VideoBlock.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"VideoBlock.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.ts"],"names":[],"mappings":"AAGA,OAAO,EAAmB,KAAK,EAAE,MAAM,cAAc,CAAC;AAKtD,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,UAAU,EAAE;YACV,aAAa,EAAE,CAAC,UAAU,EAAE;gBAC1B,GAAG,EAAE,MAAM,CAAC;gBACZ,MAAM,EAAE,MAAM,CAAC;aAChB,KAAK,UAAU,CAAC;YACjB,eAAe,EAAE,CAAC,UAAU,EAAE;gBAC5B,GAAG,EAAE,MAAM,CAAC;gBACZ,MAAM,EAAE,MAAM,CAAC;gBACf,GAAG,EAAE,MAAM,GAAG,KAAK,CAAC;aACrB,KAAK,UAAU,CAAC;YACjB,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,KAAK,UAAU,CAAC;YACvE,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,UAAU,CAAC;SACnD,CAAC;KACH;CACF;AAED,eAAO,MAAM,UAAU,6EAqGrB,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.js ADDED Viewed

@@ -0,0 +1,97 @@
+"use client";
+import { ReactNodeViewRenderer } from "@tiptap/react";
+import { mergeAttributes } from "@tiptap/core";
+import { VideoBlockView } from "./components/VideoBlockView.js";
+import { Video } from "../Video/Video.js";
+export const VideoBlock = Video.extend({
+    name: "videoBlock",
+    group: "block",
+    defining: true,
+    isolating: true,
+    addAttributes () {
+        return {
+            src: {
+                default: "",
+                parseHTML: (element)=>element.getAttribute("src"),
+                renderHTML: (attributes)=>({
+                        src: attributes.src
+                    })
+            },
+            poster: {
+                default: "",
+                parseHTML: (element)=>element.getAttribute("poster"),
+                renderHTML: (attributes)=>({
+                        poster: attributes.poster
+                    })
+            },
+            width: {
+                default: "100%",
+                parseHTML: (element)=>element.getAttribute("data-width"),
+                renderHTML: (attributes)=>({
+                        "data-width": attributes.width
+                    })
+            },
+            align: {
+                default: "center",
+                parseHTML: (element)=>element.getAttribute("data-align"),
+                renderHTML: (attributes)=>({
+                        "data-align": attributes.align
+                    })
+            },
+            alt: {
+                default: undefined,
+                parseHTML: (element)=>element.getAttribute("alt"),
+                renderHTML: (attributes)=>({
+                        alt: attributes.alt
+                    })
+            }
+        };
+    },
+    parseHTML () {
+        return [
+            {
+                tag: 'video[src*="tiptap.dev"]:not([src^="data:"]), video[src*="windows.net"]:not([src^="data:"])'
+            }
+        ];
+    },
+    renderHTML ({ HTMLAttributes }) {
+        return [
+            "video",
+            mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)
+        ];
+    },
+    addCommands () {
+        return {
+            setVideoBlock: (attrs)=>({ commands })=>{
+                    return commands.insertContent({
+                        type: "videoBlock",
+                        attrs: {
+                            src: attrs.src,
+                            poster: attrs.poster
+                        }
+                    });
+                },
+            setVideoBlockAt: (attrs)=>({ commands })=>{
+                    return commands.insertContentAt(attrs.pos, {
+                        type: "videoBlock",
+                        attrs: {
+                            src: attrs.src,
+                            poster: attrs.poster
+                        }
+                    });
+                },
+            setVideoBlockAlign: (align)=>({ commands })=>commands.updateAttributes("videoBlock", {
+                        align
+                    }),
+            setVideoBlockWidth: (width)=>({ commands })=>commands.updateAttributes("videoBlock", {
+                        width: `${Math.max(0, Math.min(100, width))}%`
+                    })
+        };
+    },
+    addNodeView () {
+        return ReactNodeViewRenderer(VideoBlockView);
+    }
+});
+export default VideoBlock;
+//# sourceMappingURL=VideoBlock.js.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/VideoBlock.ts"],"sourcesContent":["\"use client\";\n\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\nimport { mergeAttributes, Range } from \"@tiptap/core\";\n\nimport { VideoBlockView } from \"./components/VideoBlockView.js\";\nimport { Video } from \"../Video/Video.js\";\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n videoBlock: {\n setVideoBlock: (attributes: {\n src: string;\n poster: string;\n }) => ReturnType;\n setVideoBlockAt: (attributes: {\n src: string;\n poster: string;\n pos: number | Range;\n }) => ReturnType;\n setVideoBlockAlign: (align: \"left\" | \"center\" | \"right\") => ReturnType;\n setVideoBlockWidth: (width: number) => ReturnType;\n };\n }\n}\n\nexport const VideoBlock = Video.extend({\n name: \"videoBlock\",\n\n group: \"block\",\n\n defining: true,\n\n isolating: true,\n\n addAttributes() {\n return {\n src: {\n default: \"\",\n parseHTML: (element) => element.getAttribute(\"src\"),\n renderHTML: (attributes) => ({\n src: attributes.src,\n }),\n },\n poster: {\n default: \"\",\n parseHTML: (element) => element.getAttribute(\"poster\"),\n renderHTML: (attributes) => ({\n poster: attributes.poster,\n }),\n },\n width: {\n default: \"100%\",\n parseHTML: (element) => element.getAttribute(\"data-width\"),\n renderHTML: (attributes) => ({\n \"data-width\": attributes.width,\n }),\n },\n align: {\n default: \"center\",\n parseHTML: (element) => element.getAttribute(\"data-align\"),\n renderHTML: (attributes) => ({\n \"data-align\": attributes.align,\n }),\n },\n alt: {\n default: undefined,\n parseHTML: (element) => element.getAttribute(\"alt\"),\n renderHTML: (attributes) => ({\n alt: attributes.alt,\n }),\n },\n };\n },\n\n parseHTML() {\n return [\n {\n tag: 'video[src*=\"tiptap.dev\"]:not([src^=\"data:\"]), video[src*=\"windows.net\"]:not([src^=\"data:\"])',\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\n \"video\",\n mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),\n ];\n },\n\n addCommands() {\n return {\n setVideoBlock:\n (attrs) =>\n ({ commands }) => {\n return commands.insertContent({\n type: \"videoBlock\",\n attrs: { src: attrs.src, poster: attrs.poster },\n });\n },\n\n setVideoBlockAt:\n (attrs) =>\n ({ commands }) => {\n return commands.insertContentAt(attrs.pos, {\n type: \"videoBlock\",\n attrs: { src: attrs.src, poster: attrs.poster },\n });\n },\n\n setVideoBlockAlign:\n (align) =>\n ({ commands }) =>\n commands.updateAttributes(\"videoBlock\", { align }),\n\n setVideoBlockWidth:\n (width) =>\n ({ commands }) =>\n commands.updateAttributes(\"videoBlock\", {\n width: `${Math.max(0, Math.min(100, width))}%`,\n }),\n };\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(VideoBlockView);\n },\n});\n\nexport default VideoBlock;\n"],"names":["ReactNodeViewRenderer","mergeAttributes","VideoBlockView","Video","VideoBlock","extend","name","group","defining","isolating","addAttributes","src","default","parseHTML","element","getAttribute","renderHTML","attributes","poster","width","align","alt","undefined","tag","HTMLAttributes","options","addCommands","setVideoBlock","attrs","commands","insertContent","type","setVideoBlockAt","insertContentAt","pos","setVideoBlockAlign","updateAttributes","setVideoBlockWidth","Math","max","min","addNodeView"],"mappings":"AAAA;AAEA,SAASA,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,eAAe,QAAe,eAAe;AAEtD,SAASC,cAAc,QAAQ,iCAAiC;AAChE,SAASC,KAAK,QAAQ,oBAAoB;AAoB1C,OAAO,MAAMC,aAAaD,MAAME,MAAM,CAAC;IACrCC,MAAM;IAENC,OAAO;IAEPC,UAAU;IAEVC,WAAW;IAEXC;QACE,OAAO;YACLC,KAAK;gBACHC,SAAS;gBACTC,WAAW,CAACC,UAAYA,QAAQC,YAAY,CAAC;gBAC7CC,YAAY,CAACC,aAAgB,CAAA;wBAC3BN,KAAKM,WAAWN,GAAG;oBACrB,CAAA;YACF;YACAO,QAAQ;gBACNN,SAAS;gBACTC,WAAW,CAACC,UAAYA,QAAQC,YAAY,CAAC;gBAC7CC,YAAY,CAACC,aAAgB,CAAA;wBAC3BC,QAAQD,WAAWC,MAAM;oBAC3B,CAAA;YACF;YACAC,OAAO;gBACLP,SAAS;gBACTC,WAAW,CAACC,UAAYA,QAAQC,YAAY,CAAC;gBAC7CC,YAAY,CAACC,aAAgB,CAAA;wBAC3B,cAAcA,WAAWE,KAAK;oBAChC,CAAA;YACF;YACAC,OAAO;gBACLR,SAAS;gBACTC,WAAW,CAACC,UAAYA,QAAQC,YAAY,CAAC;gBAC7CC,YAAY,CAACC,aAAgB,CAAA;wBAC3B,cAAcA,WAAWG,KAAK;oBAChC,CAAA;YACF;YACAC,KAAK;gBACHT,SAASU;gBACTT,WAAW,CAACC,UAAYA,QAAQC,YAAY,CAAC;gBAC7CC,YAAY,CAACC,aAAgB,CAAA;wBAC3BI,KAAKJ,WAAWI,GAAG;oBACrB,CAAA;YACF;QACF;IACF;IAEAR;QACE,OAAO;YACL;gBACEU,KAAK;YACP;SACD;IACH;IAEAP,YAAW,EAAEQ,cAAc,EAAE;QAC3B,OAAO;YACL;YACAvB,gBAAgB,IAAI,CAACwB,OAAO,CAACD,cAAc,EAAEA;SAC9C;IACH;IAEAE;QACE,OAAO;YACLC,eACE,CAACC,QACD,CAAC,EAAEC,QAAQ,EAAE;oBACX,OAAOA,SAASC,aAAa,CAAC;wBAC5BC,MAAM;wBACNH,OAAO;4BAAEjB,KAAKiB,MAAMjB,GAAG;4BAAEO,QAAQU,MAAMV,MAAM;wBAAC;oBAChD;gBACF;YAEFc,iBACE,CAACJ,QACD,CAAC,EAAEC,QAAQ,EAAE;oBACX,OAAOA,SAASI,eAAe,CAACL,MAAMM,GAAG,EAAE;wBACzCH,MAAM;wBACNH,OAAO;4BAAEjB,KAAKiB,MAAMjB,GAAG;4BAAEO,QAAQU,MAAMV,MAAM;wBAAC;oBAChD;gBACF;YAEFiB,oBACE,CAACf,QACD,CAAC,EAAES,QAAQ,EAAE,GACXA,SAASO,gBAAgB,CAAC,cAAc;wBAAEhB;oBAAM;YAEpDiB,oBACE,CAAClB,QACD,CAAC,EAAEU,QAAQ,EAAE,GACXA,SAASO,gBAAgB,CAAC,cAAc;wBACtCjB,OAAO,CAAC,EAAEmB,KAAKC,GAAG,CAAC,GAAGD,KAAKE,GAAG,CAAC,KAAKrB,QAAQ,CAAC,CAAC;oBAChD;QACN;IACF;IAEAsB;QACE,OAAOzC,sBAAsBE;IAC/B;AACF,GAAG;AAEH,eAAeE,WAAW"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+import { ReactNode } from "react";
+import { MenuProps } from "../../../features/menus/types.js";
+export declare const VideoBlockMenu: ({ editor, appendTo }: MenuProps) => ReactNode;
+export default VideoBlockMenu;
+//# sourceMappingURL=VideoBlockMenu.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"VideoBlockMenu.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AASvD,OAAO,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAM7D,eAAO,MAAM,cAAc,yBAA0B,SAAS,KAAG,SA6GhE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.js ADDED Viewed

@@ -0,0 +1,133 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react";
+import { useCallback, useRef } from "react";
+import { sticky } from "tippy.js";
+import { v4 as uuid } from "uuid";
+import { AlignHorizontalDistributeCenter, AlignHorizontalDistributeEnd, AlignHorizontalDistributeStart } from "lucide-react";
+import { Icon } from "../../../features/ui/Icon.js";
+import { Toolbar } from "../../../features/ui/Toolbar.js";
+import { getRenderContainer } from "../../../lib/utils/index.js";
+import { VideoBlockWidth } from "./VideoBlockWidth.js";
+export const VideoBlockMenu = ({ editor, appendTo })=>{
+    const menuRef = useRef(null);
+    const tippyInstance = useRef(null);
+    const getReferenceClientRect = useCallback(()=>{
+        const renderContainer = getRenderContainer(editor, "node-videoBlock");
+        const rect = renderContainer?.getBoundingClientRect() || new DOMRect(-1000, -1000, 0, 0);
+        return rect;
+    }, [
+        editor
+    ]);
+    const shouldShow = useCallback(()=>{
+        const isActive = editor.isActive("videoBlock");
+        return isActive;
+    }, [
+        editor
+    ]);
+    const onAlignVideoLeft = useCallback(()=>{
+        editor.chain().focus(undefined, {
+            scrollIntoView: false
+        }).setVideoBlockAlign("left").run();
+    }, [
+        editor
+    ]);
+    const onAlignVideoCenter = useCallback(()=>{
+        editor.chain().focus(undefined, {
+            scrollIntoView: false
+        }).setVideoBlockAlign("center").run();
+    }, [
+        editor
+    ]);
+    const onAlignVideoRight = useCallback(()=>{
+        editor.chain().focus(undefined, {
+            scrollIntoView: false
+        }).setVideoBlockAlign("right").run();
+    }, [
+        editor
+    ]);
+    const onWidthChange = useCallback((value)=>{
+        editor.chain().focus(undefined, {
+            scrollIntoView: false
+        }).setVideoBlockWidth(value).run();
+    }, [
+        editor
+    ]);
+    return /*#__PURE__*/ _jsx(BaseBubbleMenu, {
+        editor: editor,
+        pluginKey: `videoBlockMenu-${uuid()}`,
+        shouldShow: shouldShow,
+        updateDelay: 0,
+        tippyOptions: {
+            offset: [
+                0,
+                8
+            ],
+            popperOptions: {
+                modifiers: [
+                    {
+                        name: "flip",
+                        enabled: false
+                    }
+                ]
+            },
+            getReferenceClientRect,
+            onCreate: (instance)=>{
+                tippyInstance.current = instance;
+            },
+            appendTo: ()=>{
+                return appendTo?.current;
+            },
+            plugins: [
+                sticky
+            ],
+            sticky: "popper"
+        },
+        children: /*#__PURE__*/ _jsxs(Toolbar.Wrapper, {
+            shouldShowContent: shouldShow(),
+            ref: menuRef,
+            children: [
+                /*#__PURE__*/ _jsx(Toolbar.Button, {
+                    type: "button",
+                    tooltip: "Align video left",
+                    active: editor.isActive("videoBlock", {
+                        align: "left"
+                    }),
+                    onClick: onAlignVideoLeft,
+                    children: /*#__PURE__*/ _jsx(Icon, {
+                        icon: AlignHorizontalDistributeStart
+                    })
+                }),
+                /*#__PURE__*/ _jsx(Toolbar.Button, {
+                    type: "button",
+                    tooltip: "Align video center",
+                    active: editor.isActive("videoBlock", {
+                        align: "center"
+                    }),
+                    onClick: onAlignVideoCenter,
+                    children: /*#__PURE__*/ _jsx(Icon, {
+                        icon: AlignHorizontalDistributeCenter
+                    })
+                }),
+                /*#__PURE__*/ _jsx(Toolbar.Button, {
+                    type: "button",
+                    tooltip: "Align video right",
+                    active: editor.isActive("videoBlock", {
+                        align: "right"
+                    }),
+                    onClick: onAlignVideoRight,
+                    children: /*#__PURE__*/ _jsx(Icon, {
+                        icon: AlignHorizontalDistributeEnd
+                    })
+                }),
+                /*#__PURE__*/ _jsx(Toolbar.Divider, {}),
+                /*#__PURE__*/ _jsx(VideoBlockWidth, {
+                    onChange: onWidthChange,
+                    value: parseInt(editor.getAttributes("videoBlock").width)
+                })
+            ]
+        })
+    });
+};
+export default VideoBlockMenu;
+//# sourceMappingURL=VideoBlockMenu.js.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockMenu.tsx"],"sourcesContent":["import { BubbleMenu as BaseBubbleMenu } from \"@tiptap/react\";\nimport { ReactNode, useCallback, useRef } from \"react\";\nimport { Instance, sticky } from \"tippy.js\";\nimport { v4 as uuid } from \"uuid\";\n\nimport {\n AlignHorizontalDistributeCenter,\n AlignHorizontalDistributeEnd,\n AlignHorizontalDistributeStart,\n} from \"lucide-react\";\nimport { MenuProps } from \"../../../features/menus/types.js\";\nimport { Icon } from \"../../../features/ui/Icon.js\";\nimport { Toolbar } from \"../../../features/ui/Toolbar.js\";\nimport { getRenderContainer } from \"../../../lib/utils/index.js\";\nimport { VideoBlockWidth } from \"./VideoBlockWidth.js\";\n\nexport const VideoBlockMenu = ({ editor, appendTo }: MenuProps): ReactNode => {\n const menuRef = useRef<HTMLDivElement>(null);\n const tippyInstance = useRef<Instance | null>(null);\n\n const getReferenceClientRect = useCallback(() => {\n const renderContainer = getRenderContainer(editor, \"node-videoBlock\");\n const rect =\n renderContainer?.getBoundingClientRect() ||\n new DOMRect(-1000, -1000, 0, 0);\n\n return rect;\n }, [editor]);\n\n const shouldShow = useCallback(() => {\n const isActive = editor.isActive(\"videoBlock\");\n\n return isActive;\n }, [editor]);\n\n const onAlignVideoLeft = useCallback(() => {\n editor\n .chain()\n .focus(undefined, { scrollIntoView: false })\n .setVideoBlockAlign(\"left\")\n .run();\n }, [editor]);\n\n const onAlignVideoCenter = useCallback(() => {\n editor\n .chain()\n .focus(undefined, { scrollIntoView: false })\n .setVideoBlockAlign(\"center\")\n .run();\n }, [editor]);\n\n const onAlignVideoRight = useCallback(() => {\n editor\n .chain()\n .focus(undefined, { scrollIntoView: false })\n .setVideoBlockAlign(\"right\")\n .run();\n }, [editor]);\n\n const onWidthChange = useCallback(\n (value: number) => {\n editor\n .chain()\n .focus(undefined, { scrollIntoView: false })\n .setVideoBlockWidth(value)\n .run();\n },\n [editor]\n );\n\n return (\n <BaseBubbleMenu\n editor={editor}\n pluginKey={`videoBlockMenu-${uuid()}`}\n shouldShow={shouldShow}\n updateDelay={0}\n tippyOptions={{\n offset: [0, 8],\n popperOptions: {\n modifiers: [{ name: \"flip\", enabled: false }],\n },\n getReferenceClientRect,\n onCreate: (instance: Instance) => {\n tippyInstance.current = instance;\n },\n appendTo: () => {\n return appendTo?.current;\n },\n plugins: [sticky],\n sticky: \"popper\",\n }}\n >\n <Toolbar.Wrapper shouldShowContent={shouldShow()} ref={menuRef}>\n <Toolbar.Button\n type=\"button\"\n tooltip=\"Align video left\"\n active={editor.isActive(\"videoBlock\", { align: \"left\" })}\n onClick={onAlignVideoLeft}\n >\n <Icon icon={AlignHorizontalDistributeStart} />\n </Toolbar.Button>\n <Toolbar.Button\n type=\"button\"\n tooltip=\"Align video center\"\n active={editor.isActive(\"videoBlock\", { align: \"center\" })}\n onClick={onAlignVideoCenter}\n >\n <Icon icon={AlignHorizontalDistributeCenter} />\n </Toolbar.Button>\n <Toolbar.Button\n type=\"button\"\n tooltip=\"Align video right\"\n active={editor.isActive(\"videoBlock\", { align: \"right\" })}\n onClick={onAlignVideoRight}\n >\n <Icon icon={AlignHorizontalDistributeEnd} />\n </Toolbar.Button>\n <Toolbar.Divider />\n <VideoBlockWidth\n onChange={onWidthChange}\n value={parseInt(editor.getAttributes(\"videoBlock\").width)}\n />\n </Toolbar.Wrapper>\n </BaseBubbleMenu>\n );\n};\n\nexport default VideoBlockMenu;\n"],"names":["BubbleMenu","BaseBubbleMenu","useCallback","useRef","sticky","v4","uuid","AlignHorizontalDistributeCenter","AlignHorizontalDistributeEnd","AlignHorizontalDistributeStart","Icon","Toolbar","getRenderContainer","VideoBlockWidth","VideoBlockMenu","editor","appendTo","menuRef","tippyInstance","getReferenceClientRect","renderContainer","rect","getBoundingClientRect","DOMRect","shouldShow","isActive","onAlignVideoLeft","chain","focus","undefined","scrollIntoView","setVideoBlockAlign","run","onAlignVideoCenter","onAlignVideoRight","onWidthChange","value","setVideoBlockWidth","pluginKey","updateDelay","tippyOptions","offset","popperOptions","modifiers","name","enabled","onCreate","instance","current","plugins","Wrapper","shouldShowContent","ref","Button","type","tooltip","active","align","onClick","icon","Divider","onChange","parseInt","getAttributes","width"],"mappings":";AAAA,SAASA,cAAcC,cAAc,QAAQ,gBAAgB;AAC7D,SAAoBC,WAAW,EAAEC,MAAM,QAAQ,QAAQ;AACvD,SAAmBC,MAAM,QAAQ,WAAW;AAC5C,SAASC,MAAMC,IAAI,QAAQ,OAAO;AAElC,SACEC,+BAA+B,EAC/BC,4BAA4B,EAC5BC,8BAA8B,QACzB,eAAe;AAEtB,SAASC,IAAI,QAAQ,+BAA+B;AACpD,SAASC,OAAO,QAAQ,kCAAkC;AAC1D,SAASC,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,eAAe,QAAQ,uBAAuB;AAEvD,OAAO,MAAMC,iBAAiB,CAAC,EAAEC,MAAM,EAAEC,QAAQ,EAAa;IAC5D,MAAMC,UAAUd,OAAuB;IACvC,MAAMe,gBAAgBf,OAAwB;IAE9C,MAAMgB,yBAAyBjB,YAAY;QACzC,MAAMkB,kBAAkBR,mBAAmBG,QAAQ;QACnD,MAAMM,OACJD,iBAAiBE,2BACjB,IAAIC,QAAQ,CAAC,MAAM,CAAC,MAAM,GAAG;QAE/B,OAAOF;IACT,GAAG;QAACN;KAAO;IAEX,MAAMS,aAAatB,YAAY;QAC7B,MAAMuB,WAAWV,OAAOU,QAAQ,CAAC;QAEjC,OAAOA;IACT,GAAG;QAACV;KAAO;IAEX,MAAMW,mBAAmBxB,YAAY;QACnCa,OACGY,KAAK,GACLC,KAAK,CAACC,WAAW;YAAEC,gBAAgB;QAAM,GACzCC,kBAAkB,CAAC,QACnBC,GAAG;IACR,GAAG;QAACjB;KAAO;IAEX,MAAMkB,qBAAqB/B,YAAY;QACrCa,OACGY,KAAK,GACLC,KAAK,CAACC,WAAW;YAAEC,gBAAgB;QAAM,GACzCC,kBAAkB,CAAC,UACnBC,GAAG;IACR,GAAG;QAACjB;KAAO;IAEX,MAAMmB,oBAAoBhC,YAAY;QACpCa,OACGY,KAAK,GACLC,KAAK,CAACC,WAAW;YAAEC,gBAAgB;QAAM,GACzCC,kBAAkB,CAAC,SACnBC,GAAG;IACR,GAAG;QAACjB;KAAO;IAEX,MAAMoB,gBAAgBjC,YACpB,CAACkC;QACCrB,OACGY,KAAK,GACLC,KAAK,CAACC,WAAW;YAAEC,gBAAgB;QAAM,GACzCO,kBAAkB,CAACD,OACnBJ,GAAG;IACR,GACA;QAACjB;KAAO;IAGV,qBACE,KAACd;QACCc,QAAQA;QACRuB,WAAW,CAAC,eAAe,EAAEhC,OAAO,CAAC;QACrCkB,YAAYA;QACZe,aAAa;QACbC,cAAc;YACZC,QAAQ;gBAAC;gBAAG;aAAE;YACdC,eAAe;gBACbC,WAAW;oBAAC;wBAAEC,MAAM;wBAAQC,SAAS;oBAAM;iBAAE;YAC/C;YACA1B;YACA2B,UAAU,CAACC;gBACT7B,cAAc8B,OAAO,GAAGD;YAC1B;YACA/B,UAAU;gBACR,OAAOA,UAAUgC;YACnB;YACAC,SAAS;gBAAC7C;aAAO;YACjBA,QAAQ;QACV;kBAEA,cAAA,MAACO,QAAQuC,OAAO;YAACC,mBAAmB3B;YAAc4B,KAAKnC;;8BACrD,KAACN,QAAQ0C,MAAM;oBACbC,MAAK;oBACLC,SAAQ;oBACRC,QAAQzC,OAAOU,QAAQ,CAAC,cAAc;wBAAEgC,OAAO;oBAAO;oBACtDC,SAAShC;8BAET,cAAA,KAAChB;wBAAKiD,MAAMlD;;;8BAEd,KAACE,QAAQ0C,MAAM;oBACbC,MAAK;oBACLC,SAAQ;oBACRC,QAAQzC,OAAOU,QAAQ,CAAC,cAAc;wBAAEgC,OAAO;oBAAS;oBACxDC,SAASzB;8BAET,cAAA,KAACvB;wBAAKiD,MAAMpD;;;8BAEd,KAACI,QAAQ0C,MAAM;oBACbC,MAAK;oBACLC,SAAQ;oBACRC,QAAQzC,OAAOU,QAAQ,CAAC,cAAc;wBAAEgC,OAAO;oBAAQ;oBACvDC,SAASxB;8BAET,cAAA,KAACxB;wBAAKiD,MAAMnD;;;8BAEd,KAACG,QAAQiD,OAAO;8BAChB,KAAC/C;oBACCgD,UAAU1B;oBACVC,OAAO0B,SAAS/C,OAAOgD,aAAa,CAAC,cAAcC,KAAK;;;;;AAKlE,EAAE;AAEF,eAAelD,eAAe"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { Node } from "@tiptap/pm/model";
+import { Editor } from "@tiptap/react";
+import React from "react";
+interface VideoBlockViewProps {
+    editor: Editor;
+    getPos: () => number;
+    node: Node & {
+        attrs: {
+            src: string;
+        };
+    };
+    updateAttributes: (attrs: Record<string, string>) => void;
+}
+export declare const VideoBlockView: (props: VideoBlockViewProps) => React.JSX.Element;
+export default VideoBlockView;
+//# sourceMappingURL=VideoBlockView.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"VideoBlockView.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AACxD,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,IAAI,EAAE,IAAI,GAAG;QACX,KAAK,EAAE;YACL,GAAG,EAAE,MAAM,CAAC;SACb,CAAC;KACH,CAAC;IACF,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;CAC3D;AAED,eAAO,MAAM,cAAc,UAAW,mBAAmB,sBA+BxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.js ADDED Viewed

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { NodeViewWrapper } from "@tiptap/react";
+import React, { useCallback, useRef } from "react";
+import { cn } from "../../../lib/utils/index.js";
+export const VideoBlockView = (props)=>{
+    const { editor, getPos, node } = props;
+    const videoWrapperRef = useRef(null);
+    const { src, poster } = node.attrs;
+    const wrapperClassName = cn(node.attrs.align === "left" ? "ml-0" : "ml-auto", node.attrs.align === "right" ? "mr-0" : "mr-auto", node.attrs.align === "center" && "mx-auto");
+    const onClick = useCallback(()=>{
+        editor.commands.setNodeSelection(getPos());
+    }, [
+        getPos,
+        editor.commands
+    ]);
+    return /*#__PURE__*/ _jsx(NodeViewWrapper, {
+        children: /*#__PURE__*/ _jsx("div", {
+            className: wrapperClassName,
+            style: {
+                width: node.attrs.width
+            },
+            children: /*#__PURE__*/ _jsx("div", {
+                contentEditable: false,
+                ref: videoWrapperRef,
+                children: /*#__PURE__*/ _jsx("video", {
+                    controls: true,
+                    className: "block",
+                    src: src,
+                    poster: poster,
+                    title: "",
+                    onClick: onClick
+                })
+            })
+        })
+    });
+};
+export default VideoBlockView;
+//# sourceMappingURL=VideoBlockView.js.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"sourcesContent":["import { Node } from \"@tiptap/pm/model\";\nimport { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport React, { useCallback, useRef } from \"react\";\nimport { cn } from \"../../../lib/utils/index.js\";\n\ninterface VideoBlockViewProps {\n editor: Editor;\n getPos: () => number;\n node: Node & {\n attrs: {\n src: string;\n };\n };\n updateAttributes: (attrs: Record<string, string>) => void;\n}\n\nexport const VideoBlockView = (props: VideoBlockViewProps) => {\n const { editor, getPos, node } = props;\n const videoWrapperRef = useRef<HTMLDivElement>(null);\n const { src, poster } = node.attrs;\n\n const wrapperClassName = cn(\n node.attrs.align === \"left\" ? \"ml-0\" : \"ml-auto\",\n node.attrs.align === \"right\" ? \"mr-0\" : \"mr-auto\",\n node.attrs.align === \"center\" && \"mx-auto\"\n );\n\n const onClick = useCallback(() => {\n editor.commands.setNodeSelection(getPos());\n }, [getPos, editor.commands]);\n\n return (\n <NodeViewWrapper>\n <div className={wrapperClassName} style={{ width: node.attrs.width }}>\n <div contentEditable={false} ref={videoWrapperRef}>\n <video\n controls\n className=\"block\"\n src={src}\n poster={poster}\n title=\"\"\n onClick={onClick}\n />\n </div>\n </div>\n </NodeViewWrapper>\n );\n};\n\nexport default VideoBlockView;\n"],"names":["NodeViewWrapper","React","useCallback","useRef","cn","VideoBlockView","props","editor","getPos","node","videoWrapperRef","src","poster","attrs","wrapperClassName","align","onClick","commands","setNodeSelection","div","className","style","width","contentEditable","ref","video","controls","title"],"mappings":";AACA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,OAAOC,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAQ;AACnD,SAASC,EAAE,QAAQ,8BAA8B;AAajD,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGH;IACjC,MAAMI,kBAAkBP,OAAuB;IAC/C,MAAM,EAAEQ,GAAG,EAAEC,MAAM,EAAE,GAAGH,KAAKI,KAAK;IAElC,MAAMC,mBAAmBV,GACvBK,KAAKI,KAAK,CAACE,KAAK,KAAK,SAAS,SAAS,WACvCN,KAAKI,KAAK,CAACE,KAAK,KAAK,UAAU,SAAS,WACxCN,KAAKI,KAAK,CAACE,KAAK,KAAK,YAAY;IAGnC,MAAMC,UAAUd,YAAY;QAC1BK,OAAOU,QAAQ,CAACC,gBAAgB,CAACV;IACnC,GAAG;QAACA;QAAQD,OAAOU,QAAQ;KAAC;IAE5B,qBACE,KAACjB;kBACC,cAAA,KAACmB;YAAIC,WAAWN;YAAkBO,OAAO;gBAAEC,OAAOb,KAAKI,KAAK,CAACS,KAAK;YAAC;sBACjE,cAAA,KAACH;gBAAII,iBAAiB;gBAAOC,KAAKd;0BAChC,cAAA,KAACe;oBACCC,QAAQ;oBACRN,WAAU;oBACVT,KAAKA;oBACLC,QAAQA;oBACRe,OAAM;oBACNX,SAASA;;;;;AAMrB,EAAE;AAEF,eAAeX,eAAe"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockWidth.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import React from "react";
+export type VideoBlockWidthProps = {
+    onChange: (value: number) => void;
+    value: number;
+};
+export declare const VideoBlockWidth: React.MemoExoticComponent<({ onChange, value }: VideoBlockWidthProps) => React.JSX.Element>;
+//# sourceMappingURL=VideoBlockWidth.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockWidth.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"VideoBlockWidth.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockWidth.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,eAAe,kDACJ,oBAAoB,uBA+B3C,CAAC"}